<template>
  <div class="echart-part">
    <echart-title :title="para.title"></echart-title>
    <div :id="para.id" class="echart_content" style="align-items: center;">
      <div class="myflex">

        <div>
<!--          <div>低风险区域</div>-->
          <dv-decoration-9 style="width:10vw;height:10vw;">66%</dv-decoration-9>
        </div>
        <div style="padding: 8px 16px">
<!--          <div>低风险区域</div>-->
          <dv-percent-pond :config="config" style="width:10vw;height:5vw;" />
        </div>
      </div>

    </div>
  </div>
</template>

<script>
const echarts = require('echarts')
import EchartTitle from "../common/echart-title";


let color1 = ['#FFFF33', '#33FFDD', '#FF8800']
let color2 = ['#99FF33', '#FF0000']
let myChart
export default {
  name: 'auditcount-data',
  components: {EchartTitle},
  props: {
    para: {}
  },
  data() {
    return {
      config:{
        value: 66
      }
    }
  },
  mounted() {

  },
  methods: {
  }
}
</script>

<style scoped>

.myflex {
  display: flex;
  justify-content: space-around;
  width: 100%;
  height: 100%;
}
.myflex div{
  flex-grow: 1;

  display: flex;
  align-items: center;
}
</style>

